<template>
	<view class="imgB">
		<!-- 图片 -->
		<image :src="urls" mode="" @click="clickImg" v-if="!fileName"></image>
		<!-- 文件 -->
		<view v-else @click="openFile" style="color: blue;" class="file">
			{{fileName}}
		</view>
	</view>
</template>

<script>
	import BASE_URL from '@/api/env.js'
	export default {
		data() {
			return {
				urls: null,
				// 文件的名字
				fileName: '',
			}
		},
		methods: {
			clickImg() {
				uni.previewImage({
					current: 0,
					urls: [this.urls]
				});
			},
			get() {
				this.$api.getVideoUrlpage().then(res => {
					if (res.rows[0].path.indexOf('.jpg') != -1 || res.rows[0].path.indexOf('.png') != -1) {
						this.urls = BASE_URL.substring(0, BASE_URL.length) + res.rows[0].path
						this.clickImg()
					} else {
						this.urls = BASE_URL.substring(0, BASE_URL.length) + res.rows[0].path
						this.fileName = res.rows[0].newFilename
						this.openFile()
					}
				})
			},
			// 打开文件
			openFile() {
				uni.downloadFile({
					url: this.urls,
					success: function(res) {
						var filePath = res.tempFilePath;
						uni.openDocument({
							filePath: filePath,
							showMenu: true,
							success: function(res) {
								console.log('打开文档成功');
							}
						});
					}
				});
			},
		},
		onLoad() {
			this.get()
		},
	}
</script>
<style lang="scss" scoped>
	.file {
		display: flex;
		align-items: center;
	}

	.imgB {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 100%;
	}
</style>